/*
 * @Author: huangtianyang 916072572@qq.com
 * @Date: 2023-11-20 11:19:02
 * @LastEditors: huangtianyang
 * @LastEditTime: 2024-04-29 11:44:37
 * @FilePath: \cxl-driving-training\src\views\drivingSchoolManagement\shop\index.ts
 */
import { BaseData, BaseMethod } from '@/utils/basc-data'
import { tableConfig } from './config'
import { reactive } from 'vue'
import router from '@/router'
import { DICT_DATA } from '@/utils/dict-data'
import { ElMessage, FormInstance, FormRules } from 'element-plus'
import { provinceAndCityData, pcTextArr, regionData, pcaTextArr, codeToText } from 'element-china-area-data'

interface RuleForm {
    schoolName: string
    siteShopName: string
    address: string
    lat: string
    lng: string
    regionId: string
    schoolId: string
    city: string
    id: string
    regionName: string
}

export default class DistrictData extends BaseData implements BaseMethod {
    searchData = { name: '' }
    drivingSchoolOptions: { label: string; value: string }[] = reactive([])
    dialog = reactive({
        visible: false,
        title: '新增',
        type: 'create',
        width: '800px',
        inputVal: ''
    })
    ruleForm = reactive<RuleForm>({
        schoolName: '',
        siteShopName: '',
        address: '',
        lat: '',
        lng: '',
        regionId: '',
        schoolId: '',
        city: '',
        id: '',
        regionName: ''
    })
    rules = reactive<FormRules<RuleForm>>({
        schoolName: [{ required: true, message: '请选择驾校', trigger: 'change' }],
        siteShopName: [{ required: true, message: '请输入场地门店名称', trigger: 'blur' }],
        address: [{ required: true, message: '请输入详细地址', trigger: 'blur' }]
    })
    constructor() {
        super(tableConfig)

        this.uStore.queryDrivingSchoolSimple((res: Map<string, any>) => {
            res.forEach(item => {
                this.drivingSchoolOptions.push({ label: item.shortName, value: item.id })
            })
        })

        console.log(provinceAndCityData, pcTextArr, regionData, pcaTextArr, codeToText)

        this.getData()
    }
    getData = (arg?: any) => {}
    onSearch = (arg?: any) => {
        console.log(arg)
        this.searchData = arg
        this.getData()
    }
    onReset = (arg?: any) => {
        this.searchData = { name: '' }
        this.getData()
    }
    onPaginationChange = (arg?: any) => {
        this.pageData.pagination.pageNo = arg
        this.getData()
    }
    onPaginationSize = (arg?: any) => {
        this.pageData.pagination.pageNo = 1
        this.pageData.pagination.pageSize = arg
        this.getData()
    }
    onOperation = (arg?: any) => {
        const { type, data } = arg
        console.log(type, data)
        this.dialog.type = type
        if (type === 'create') {
            this.dialog.visible = true
            this.ruleForm.id = ''
            this.ruleForm.siteShopName = ''
            this.ruleForm.address = ''
            this.ruleForm.schoolName = ''
            this.ruleForm.schoolId = ''
            this.ruleForm.regionId = ''
            this.ruleForm.city = ''
            this.ruleForm.lat = ''
            this.ruleForm.lng = ''
            this.ruleForm.regionName = ''
            this.dialog.inputVal = ''
        } else if (type === 'edit' || type === 'look') {
            this.dialog.visible = true
        } else if (type === 'switch') {
            //
        }
    }
    dialogClose = async (type: string, formEl: FormInstance | undefined) => {
        if (!formEl) return
        if (type === 'confirm') {
            await formEl.validate((valid, fields) => {
                if (valid) {
                    console.log('submit!')
                    if (this.dialog.type === 'create') {
                        //
                    } else if (this.dialog.type === 'edit') {
                        //
                    }
                } else {
                    console.log('error submit!', fields)
                }
            })
        } else {
            formEl.resetFields()
            this.dialog.visible = false
        }
    }
    timer: any = null
    //监听输入框
    onInputChange = (res: string) => {
        console.log(res)
        if (this.timer) {
            clearTimeout(this.timer)
        }
        this.timer = setTimeout(() => {
            console.log('开始执行')
            this.dialog.inputVal = res
        }, 500)
    }
    //监听选择地图返回的数据
    onMapChange = (res: any) => {
        console.log('监听选择地图返回的数据', res)
        this.dialog.inputVal = ''
        console.log('inputVal', this.dialog.inputVal)
        if (res.address) {
            this.ruleForm.address = res.address
            this.ruleForm.regionId = res.adcode
            this.ruleForm.lat = res.lat
            this.ruleForm.lng = res.lng
            this.ruleForm.city = codeToText[res.adcode.slice(0, 4)]
            this.ruleForm.regionName = res.regionName
            console.log('this.ruleForm', this.ruleForm)
        }
    }
    onSelectSchoolChange = (schoolId: string) => {
        console.log('选择驾校', schoolId)
        this.ruleForm.schoolId = schoolId
    }
}
